/* ==========================================================================
   PUBLISH COMPONENT
   ========================================================================== */

.publishing .page-wrapper {
    padding: 0;

    .publish-errors {
        margin: 0 24px 24px;
        padding: 16px 0;
    }
}

.publish-tab-outer {
    @apply flex justify-between;
}

.publish-form {
    position: relative;

    .loading-blocker {
        padding-top: 50px;
        border-radius: 3px;
    }
}

.head .status {
    display: inline-block;
    label {
        margin: 0 6px 0 0 ; [dir="rtl"] & { margin: 0 0 0 6px ; }
        position: relative;
        top: 3px;
    }
    > div {
        display: inline-block;
        position: relative;
        top: 8px;
    }

}

code.parent-url {
    @apply block text-3xs bg-none text-gray-700;
    padding: 0 0 3px 0 ; [dir="rtl"] & { padding: 0 0 3px 0 ; }
}

.publish-fields {
    @apply flex flex-wrap;

    .form-group {
        > label,
        .field-inner > label {
            @apply font-medium mb-2;
        }
    }

    > .form-group:last-child {
        margin-bottom: 0;
    }

    .has-error > .field-inner > label {
        @apply text-red-500;
    }

    .field-inner {
        position: relative;
    }

    .read-only-overlay {
        @apply absolute inset-0 cursor-not-allowed bg-white/25;
        z-index: 100;
    }

    .has-field-dropdown {
        .field-inner {
            @apply pr-6;
        }
        .field-dropdown {
            @apply block absolute bottom-[-3px] right-0;
        }
        &:not(.has-field-label) {
            .field-inner {
                @apply min-h-[19.5px] mb-2;
            }
        }
    }
}

.publish-field {
    @apply relative;
}

.publish-field-label {
    @apply flex items-center;
}

.publish-sections-section {
    @apply mb-8;
}

.publish-section-header {
    @apply border-b border-gray-400 dark:border-dark-900 bg-gray-100 dark:bg-dark-700 rounded-t-lg;
}

.publish-section-header-inner {
    @apply px-4 @lg:px-6 pt-4 pb-3;

}

.publish-sidebar {
    @apply shrink-0;
    margin-left: 20px ; [dir="rtl"] & { margin-right: 20px ; margin-left: 0 ; }
    width: 300px;

    .publish-fields .form-group {
        @apply p-4;
    }
}

.publish-tab-actions-footer {
    @apply mt-6;
}

.sneak-peek-editing .publish-tabs {
    position: sticky;
    top: 0;
    z-index: 1000;
}
